<template>
  <div class="main_box" style="margin-top: 10px;">
    <!-- Title -->
    <top_title :formConfig="formConfig">
      <div slot="button">
        <div style="width: 100%;display: flex;justify-content: space-between;">
          <div>
            <el-button type="primary" size="small" @click="getlist(true)">搜索</el-button>
            <el-button size="small" @click="refresh">刷新</el-button>
          </div>
          <div>
            <el-button type="primary" size="small" @click="add">新增</el-button>
          </div>
        </div>
      </div>
    </top_title>
    <!-- Table -->
    <el-card>
      <table-list :columns="tableColumns" :tableData="group_list" :pageObj="pageObj" :loading="loading" :type="true"
        @handleCurrentChange="handleCurrentChange" @handleSelectionChange="handleSelectionChange" :btnlong="'200'"
        @switch="release">
        <template #header="slotProps">
          <el-button type="text" size="small" @click="edit(slotProps.date)" v-btn-key="['client:clue:update']"
            v-if="slotProps.date.role_key != 'admin'">编辑</el-button>
          <el-button type="text" size="small" @click="del(slotProps.date)" v-btn-key="['client:clue:update']"
            v-if="slotProps.date.role_key != 'admin'">删除</el-button>
        </template>
      </table-list>
    </el-card>
    <!-- 新增编辑 -->
    <el-dialog :title="title" :visible.sync="dialogVisible" width="40%" :close-on-press-escape="false"
      :close-on-click-modal="false">
      <el-form :model="ruleForm" :rules="rules" ref="ruleForm" :label-width="'120px'" class="demo-ruleForm"
        :label-position="'center'">
        <el-form-item label="名称" prop="dict_label">
          <el-input v-model="ruleForm.dict_label" style="width: 100%;" clearable></el-input>
        </el-form-item>
        <el-form-item label="参数值" prop="dict_value">
          <el-input v-model="ruleForm.dict_value" style="width: 100%;" clearable></el-input>
        </el-form-item>
        <!-- <el-form-item label="类型" prop="">
          <el-input v-model="ruleForm.dict_type" style="width: 100%;" clearable></el-input>
        </el-form-item> -->
        <el-form-item label="排序" prop="">
          <el-input-number v-model="ruleForm.dict_sort" style="width: 100%;" controls-position="right" :min="1"
            :max="100"></el-input-number>
        </el-form-item>
        <el-form-item label="状态" prop="">
          <el-radio-group v-model="ruleForm.status">
            <el-radio :label="item.value" v-for="item in opotionslist" :key="item.value">{{ item.label
            }}</el-radio>
          </el-radio-group>
        </el-form-item>
        <el-form-item label="备注" prop="">
          <el-input v-model="ruleForm.remark" type="textarea" :rows="2" placeholder="请输入内容" style="width: 100%;"
            clearable></el-input>
        </el-form-item>
        <div style="display: flex;justify-content: flex-end;">
          <el-button type="primary" size="small" @click="submitForm('ruleForm')">{{ title + '提交' }}</el-button>
        </div>
      </el-form>
    </el-dialog>
  </div>
</template>

<script>
import {
  getdict_datalist,
  getdict_data_add,
  getdict_data_update,
  getdictdelete_data
} from "@/api/main/dictionary";
import list from './dictionarycopy.json'
export default {
  name: "",
  components: {},
  data() {
    return {
      // 列表加载状态
      loading: true,
      // 弹框信息
      title: "新增",
      dialogVisible: false,
      // 列表类型
      tableColumns: list.tableColumns,
      // 列表数据
      group_list: [],
      //分页参数
      pageObj: {
        size: 10,
        currentPage: 1, //前往当前页
        total: 100
      },
      // 搜索栏
      formConfig: list.formConfig,
      rules: list.rules,
      ruleForm: {
        dict_code: 0,
        dict_label: "",
        dict_value: "",
        // dict_type: "",
        dict_sort: "",
        status: "0",
        remark: "",
      },
      // 选择参数
      opotionslist: [
        {
          value: '1',
          label: "正常"
        },
        {
          value: '0',
          label: "停用"
        }
      ],
    };
  },
  created() {
    this.getlist(true);
  },
  mounted() { },
  methods: {
    refresh() {
      this.formConfig.form.daterange = []
      this.getlist(true);
    },
    // 首次获取
    getlist(val) {
      if (val) {
        this.pageObj.currentPage = 1
      }
      let start = ""
      let end = ""
      if (this.formConfig.form.daterange.length > 0) {
        start = this.formConfig.form.daterange[0] + ' 00:00:00'
        end = this.formConfig.form.daterange[1] + ' 23:59:59'
      }
      this.loading = true
      let params = {
        dict_type: this.$route.query.dict_type,
        start_time: start,
        over_time: end,
      }
      getdict_datalist(params)
        .then((res) => {
          if (res.status == 1) {
            this.group_list = res.data;
            this.pageObj.total = res.total
            this.loading = false
          } else {
            this.loading = false
          }
        })
        .catch((err) => {
          this.loading = false
        });
    },
    // 新增
    add() {
      this.title = "新增"
      this.dialogVisible = true
      this.ruleForm = {
        dict_code: "",
        dict_label: "",
        dict_value: "",
        // dict_type: "",
        dict_sort: "",
        status: "1",
        remark: "",
      }
    },
    // 修改
    edit(val) {
      this.title = "编辑"
      this.dialogVisible = true
      this.ruleForm = {
        dict_code: val.dict_code,
        dict_label: val.dict_label,
        dict_value: val.dict_value,
        // dict_type: val.dict_type,
        dict_sort: val.dict_sort,
        status: val.status,
        remark: val.remark,
      }
      // getdictinfo({ dict_code: val.dict_code })
      //   .then((res) => {
      //     if (res.status == 1) {
      //       this.ruleForm = {
      //         dict_code: res.data.dict_code,
      //         dict_label: res.data.dict_label,
      //         dict_type: res.data.dict_type,
      //         status: res.data.status,
      //         remark: res.data.remark,
      //       }
      //       this.$message.success(res.msg);
      //     } else {
      //       this.$message.error(res.msg);
      //     }
      //   })
      //   .catch((err) => {
      //     this.$message.error(res.msg);
      //   });
    },
    // 删除
    del(val) {
      getdictdelete_data({ id: val.dict_code })
        .then((res) => {
          if (res.status == 1) {
            this.$message.success(res.msg);
            this.getlist(true);
          } else {
            this.$message.error(res.msg);
          }
        })
        .catch((err) => {
          this.$message.error(res.msg);
        });
    },
    // 信息提交
    submitForm(formName) {
      this.$refs[formName].validate((valid) => {
        if (valid) {
          let parms = {
            dict_code: this.ruleForm.dict_code,
            dict_label: this.ruleForm.dict_label,
            dict_value: this.ruleForm.dict_value,
            dict_type: this.$route.query.dict_type,
            dict_sort: this.ruleForm.dict_sort,
            status: this.ruleForm.status,
            remark: this.ruleForm.remark,
          }
          if (this.ruleForm.dict_code == "") {
            this.addrole(parms)
          } else {
            this.editrole(parms)
          }
        } else {
          return false;
        }
      });
    },
    // 新增提交
    addrole(parms) {
      getdict_data_add(parms)
        .then((res) => {
          if (res.status == 1) {
            this.getlist(true)
            this.dialogVisible = false
            this.$message.success(res.msg);
          } else {
            this.dialogVisible = false
            this.$message.error(res.msg);
          }
        })
        .catch((err) => {
          this.dialogVisible = false
          this.$message.error(res.msg);
        });
    },
    // 修改提交
    editrole(parms) {
      getdict_data_update(parms)
        .then((res) => {
          if (res.status == 1) {
            this.getlist(true)
            this.dialogVisible = false
            this.$message.success(res.msg);
          } else {
            this.dialogVisible = false
            this.$message.error(res.msg);
          }
        })
        .catch((err) => {
          this.dialogVisible = false
          this.$message.error(res.msg);
        });
    },
    // 状态修改
    release(val) {
      console.log(val, "状态修改")
      // getuserchange({
      //   user_id: val.user_id,
      //   status: val.status
      // })
      //   .then(res => {
      //     if (res.status == 1) {
      //       this.getlist(false);
      //       this.$message.success(res.msg);
      //     } else {
      //       this.$message.error(res.msg || "数据响应过慢，请稍后再试");
      //     }
      //   })
      //   .catch(err => {
      //     console.log(err);
      //   });
    },
    // 多选
    handleSelectionChange(val) {
      console.log(val, 123)
    },
    // 页码选择
    handleCurrentChange(val) {
      this.pageObj.currentPage = val
      this.getlist(false);
    },

  },
};
</script>

<style lang="less" scoped></style>
